@import "../../playerColors.less";
@import "./size.less";
@scorll-bar-radius: @scorll-bar-width * 0.5;
@scorll-bar-color: @btn-hover-color;
.container {
    .content {
        // margin-right: @scorll-bar-width;
        padding-top: @top-bar-height;
        .scorll-content {
            position: relative;
        }
    }
    .top-content {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: @top-bar-height;
        z-index: 11;
        margin-bottom: 1px;
    }
    .barBuffer {
        position:absolute;
        top: 0;
        right: 0;
        z-index: 10;
        padding-left: 20px;
        height: 100%;
        padding-top: @top-bar-height;
        .bar-outer {
            position: relative;
            width: @scorll-bar-width;
            height: 100%;
            border-radius: @scorll-bar-radius;
            background-color: lighten(@player-font-color, 60%);
            overflow:hidden;
            .bar-inner {
                position: absolute;
                top: 0;
                left: 0;
                border-radius: @scorll-bar-radius;
                width: 100%;
                background-color: @scorll-bar-color;
                cursor: pointer;
                &:hover {
                   background-color: lighten(@scorll-bar-color, 20%);
                }
            }
        }
    }
}